<table id="j_datagrid_tree" data-toggle="datagrid" data-options="{
    width: '100%',
    height: '100%',
    gridTitle: '树状datagrid 示例 ',
    showToolbar: true,
    toolbarItem:'add, cancel, del, save',
    {{--editMode: 'dialog',--}}
    local: 'local',
    dataUrl: 'admin/category/list',
    inlineEditMult: false,
    editUrl: 'admin/category/add',
    delUrl: 'admin/category/delete',
    isTree: 'cat_name',
    addLocation: 'last',
    fieldSortable: false,
    columnMenu: false,
    paging: {pageSize:9999, selectPageSize:'100', pageCurrent:1, showPagenum:5, totalRow:0},
    {{--paging: false,--}}
    treeOptions: {
        expandAll: false,
        add: true,
        simpleData: true,
        keys: {
            parentKey: 'pid',
            order:'sort_id'
        }
    },
    dropOptions: {
        drop: true,
        position: 'before',
        dropUrl: '../../json/ajaxDone.json',
        beforeDrag: datagrid_tree_beforeDrag,
        beforeDrop: datagrid_tree_beforeDrop,
        afterDrop: 'array',
        order: 'sort_id',
    }
}">
    <thead>
    <tr>
        <th data-options="{name:'cat_name', align:'center', width:300, rule:'required'}">分类名称</th>
        <th data-options="{name:'sort_id', align:'center', width:300, rule:'required'}">排序</th>
        <th data-options="{name:'company_id', align:'center', width:300, rule:'required', edit:false, add:false}">厂</th>
        {{--<th data-options="{name:'image_path', align:'center',render:'datagrid_image_tag', width:300, rule:'required'}">分类图片</th>--}}
        <th data-options="{name:'display', align:'center', width:300, type:'select', items:datagrid_tree_department}">是否显示</th>
        <th data-options="{render:datagrid_tree_operation}">操作列</th>
    </tr>
    </thead>
</table>
<script type="text/javascript">
    function datagrid_tree_department() {
        return [{1:'显示'},{0:'不显示'}]
    }
    // 操作列
    function datagrid_tree_operation(value, data) {
        var html = '<button type="button" class="btn-green" data-toggle="edit.datagrid.tr">编辑</button>'
                + '<button type="button" class="btn-green" data-toggle="dialog" data-options="{id:\'category-fields-dialog\',fresh:true, url:\'/admin/category/fields-list\', title:\'材料分类字段\',width:1000,height:1000, data:{category_id:' + data.id + '}}">默认字段</button>'
                + '<button type="button" class="btn-green" data-toggle="dialog" data-options="{id:\'category-fields-dialog\',fresh:true, url:\'/admin/pro/add\', title:\'材料分类字段\',width:1000,height:1000, data:{category_id:' + data.id + '}}">材料添加</button>'
                + '<button type="button" class="btn-red" data-toggle="del.datagrid.tr">删除</button>'

        return html
    }
    function datagrid_image_tag(value,data){
        return '<img src="'+value+'">'
    }
    //不能拖动一级父节点
    function datagrid_tree_beforeDrag(tr, data) {
        if (data && data.level == 0) {
            return false
        }

        return true
    }
    // 不能将子节点拖为一级父节点
    function datagrid_tree_beforeDrop(data, targetData, position) {
        if (targetData && targetData.level == 0 && position !== 'append') {
            return false
        }

        return true
    }
</script>